<template>
  <!-- 客户管理-新增客户 -->
  <div class="newCustomer">
    <!-- 顶部导航 -->
    <div class="newCustomer_top">
      <van-nav-bar
        title="新增客户信息"
        left-arrow
        @click-left="$router.go(-1)"
        :border="false"
        fixed
        z-index="999"
      >
        <template #right>
          <van-icon
            name="wap-home-o"
            size="25"
            @click="$router.push('/home')"
          />
        </template>
      </van-nav-bar>
    </div>

    <div class="newCustomer_box">
      <van-field
        v-model="val1"
        name="客户姓名"
        label="客户姓名"
        placeholder="请填写客户姓名"
      />

      <van-field
        v-model="val2"
        name="联系方式"
        label="联系方式"
        placeholder="请填写联系方式"
      />
    </div>

    <div class="newCustomer_box2">
      <van-field
        v-model="val3"
        name="学历"
        label="学历"
        placeholder="请填写学历"
      />
      <van-field
        v-model="val4"
        name="年龄"
        label="年龄"
        placeholder="请填写年龄"
      />
      <van-field
        v-model="val5"
        name="性别"
        label="性别"
        placeholder="请填写性别"
      />
      <van-field
        v-model="val6"
        name="所属城市"
        label="所属城市"
        placeholder="请填写所属城市"
      />
      <van-field
        v-model="val7"
        name="公司名称"
        label="公司名称"
        placeholder="请填写公司名称"
      />
      <van-field
        v-model="val8"
        name="职务"
        label="职务"
        placeholder="请填写职务"
      />
    </div>
    <van-button
      type="primary"
      size="large"
      color="#039"
      round
      @click="AddTheCustomer"
    >
      保存
    </van-button>
  </div>
</template>

<script>
import { NewCustomer } from "@/request/api";
export default {
  data() {
    return {
      val1: "",
      val2: "",
      val3: "",
      val4: "",
      val5: "",
      val6: "",
      val7: "",
      val8: "",
    };
  },
  methods: {
    AddTheCustomer() {
      NewCustomer({
        custName: this.val1,
        cityName: this.val6,
        company: this.val7,
        position: this.val8,
        telephone: this.val2,
        education: this.val3,
        sex: this.val5,
        age: this.val4,
      }).then((res) => {
        // console.log(res);
      });
      // 提示并跳转
      this.$toast.success("添加成功");
      setTimeout(() => {
        this.$router.push("customerManagement");
      }, 1000);
    },
  },
};
</script>
 
<style lang = "less" scoped>
/* 顶部导航 */
.newCustomer_top {
  .van-nav-bar {
    background-color: #003399;
  }

  /deep/.van-icon,
  /deep/.van-nav-bar__title {
    color: #ffffff;
  }
}

/* 新增 */
.newCustomer_box {
  padding-top: 0.6rem;
  padding-bottom: 0.15rem;
}
.van-button {
  background-color: #fff;
  position: fixed;
  bottom: 0;
}
</style>